@charset "UTF-8";
/**
 * 
 * @authors wu
 * @date    2017-06-04 10:39:39
 * @version 1.0.0
 */
@redColor: rgb(70, 146, 242);
@mainColor: #2bc697;
/*-------------------------    start  ------------------------- */
html,body{ font-size: 125%; background-color: #f4f4f4;}
body{ font-family: "Microsoft Yahei", Arial, Verdana; padding: 0; -webkit-text-size-adjust: 100% !important; text-size-adjust: 100% !important; -moz-text-size-adjust: 100% !important;}

ul{ margin: 0; padding: 0; list-style-type: none;}
li{list-style-type:none;}
.fl{ float: left;}
.fr{ float: right;}
.clearfix:after{ content: ""; display: block; clear: both; visibility: hidden; line-height: 0; height: 0; font-size: 0;}
.clearfix{ *zoom: 1;}
.ell{ white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.breakAll{ word-break: break-all;}
.overflow{ overflow: hidden;}
.borderRadius{ border-radius: 50%;}
.bold{ font-weight: bold; }
.nowrap{ white-space: nowrap;}
.lineThrough{ text-decoration: line-through;}
.underline{ text-decoration: underline;}
input,a{ outline: none; -webkit-appearance: none; -webkit-tap-highlight-color: rgba(0,0,0,0); text-decoration:none;}
img { max-width: 100%; }
img.loadImg,img.user_avatar{ max-width: none;}
[v-cloak]{ display: none;}

/*-------------------------    end  ------------------------- */

/* 定位 */
.pa{ position: absolute;}
.pr{ position: relative;}
.pf{ position: fixed;}
/* block */
.db{ display: block;}
.dib{ display: inline-block;}
.dn{ display: none;}
/* text */
.textC{ text-align: center;}
.textL{ text-align: left;}
.textR{ text-align: right;}
/*background-color*/
.bgff{ background-color: #fff;}
.bgf0{ background-color: #f0f0f0;}
.bgf4{ background-color: #f4f4f4;}
/* border */
.border{ border: 1px solid #efefef;}
.borderN{ border: none;}
.borderT{ border-top: 1px solid #efefef;}
.borderB{ border-bottom: 1px solid #efefef;}
.dashedT{ border-top: 1px dashed #efefef;}
.dashedB{ border-bottom: 1px dashed #efefef;}
/* 灰色背景层 */
.borderspace{ border-bottom: 0.25rem solid #f4f4f4;}
.borderTS{ border-top: 0.25rem solid #f4f4f4;}
/* border-radius */
.bRadius{ border-radius: 5px;}
/*font-size*/
.font12{ font-size: 0.25rem;}
.font18{ font-size: 0.45rem;}
.font20{ font-size: 0.5rem;}
.font22{ font-size: 0.55rem;}
.font24{ font-size: 0.6rem;}
.font26{ font-size: 0.65rem;}
.font28{ font-size: 0.7rem;}
.font30{ font-size: 0.75rem;}
.font32{ font-size: 0.8rem;}
.font34{ font-size: 0.85rem;}
.font36{ font-size: 0.9rem;}
.font48{ font-size: 1.2rem;}
.normal{ font-weight: normal;}
/*line-height*/
.line15{ line-height: 1.5;}
/*padding*/
.pad24{ padding: 2.4%;}
.padL24{ padding-left: 2.4%;}
.padR24{ padding-right: 2.4%;}
.padT24{ padding-top: 2.4%;}
.padB24{ padding-bottom: 2.4%;}
.pad40{ padding: 5.3%;}
.padT40{ padding-top: 5.3%;}
.padR40{ padding-right: 5.3%;}
.padB40{ padding-bottom: 5.3%;}
.padL40{ padding-left: 5.3%;}
.padTB40{ padding-top: 5.3%; padding-bottom: 5.3%;}
.padLR40{ padding-left: 5.3%; padding-right: 5.3%;}
.padTB24{ padding-top: 2.4%; padding-bottom: 2.4%;}
.padLR24{ padding-left: 2.4%; padding-right: 2.4%;}
.padT24{ padding-top: 2.4%;}
.padB24{ padding-bottom: 2.4%;}
.pad375{ padding: 3.75%;}

.padT23{ padding-top: 2.3rem;} 
.padB25{ padding-bottom: 2.5rem;}
.padB35{ padding-bottom: 3.5rem;}
/*margin*/
.mar24{ margin: 2.4%;}
.marTB24{ margin-top:2.4%; margin-bottom: 2.4%;}
.marT24{ margin-top: 2.4%;}
.marB24{ margin-bottom: 2.4%;}
.marL24{ margin-left: 2.4%;}
.marR24{ margin-right: 2.4%;}
.marT40{ margin-top: 5.3%;}

.mar12{ margin: 1.2%;}
.marT12{ margin-top: 1.2%;}
.marB12{ margin-bottom: 1.2%;}
/*width*/
.w33 { width: 33%;}
.w50 { width: 50%;}
.w100{ width: 100%;}

.wh45{ width: 0.95rem; height: 0.95rem;}
/*line-height*/
.line95{ line-height: 0.95rem;}
/*color*/
.color33{ color:#333;}
.colora3{ color: #a3a3a3;}
.color1c{ color: #1c1c20;}
.colorG{ color: #259B24;}
.colorB{ color: rgb(70, 146, 242)}
.colorY{ color: #FF9800;}
.colorR{ color: rgb(202, 31, 37);}
.colore4{ color: @mainColor;}
.colorfb{ color: #fbd748; }
.color60{ color: #606060;}
.color66{ color: #666;}
.color92{ color: #929292;}
.color99{ color: #999;}
.colore0{ color: #e0e0e0;}
.colorff{ color: #fff;}
/*background-color*/
.bgf4{ background-color: #f4f4f4;}

/*头部*/
.header{ position: fixed; top: 0; left: 0; z-index: 20; width: 100%; height: 2.3rem; line-height: 2.3rem; color: #fff; background-color: rgb(34, 41, 44);
	h1{ margin: auto; width: 50%; text-align: center; font-size: 0.94rem; font-weight: normal; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
	.icon{ position: absolute; top: 50%; z-index: 21; display: block; margin-top: -1.01rem; padding: 0.5rem; width: 1.02rem; height: 1.02rem; background: url(../images/header.png); background-clip: content-box; background-size: auto 3.05rem;}
	.closeIcon{ left: 0; background-position: 0.5rem 0.5rem;}
	.contactIcon{ left: 0; background-position: 0.5rem 0.5rem;}
	.back{ left: 0; background-position: -0.5rem 0.5rem;}
	.collectIcon{ right: 0; background-position: -2.51rem -1.54rem;
		&.on{ background-position: -0.5rem -0.5rem;}
	}
	.addIcon{ right: 0; background-position: -1.54rem 0.5rem;}
	.shareIcon{ right: 0; background-position: -1.54rem -0.52rem;}
	.flIcon{ right: 0; background-position: -2.51rem -1.54rem;}

	.text{ position: absolute; top: 0; right: 2.4%; z-index: 21; font-size: 0.7rem; color: #fff;}
	.del{ position: absolute; top: 50%; right: 0.5rem; z-index: 21; display: block; margin-top: -0.51rem; width: 1.02rem; height: 1.02rem;background: url(../images/del.png); background-size: cover;
	}
	.down{ position: absolute; top: 42%; content: ''; display: inline-block; margin-left: 2%; width: 0; height: 0; border-left: 5px solid transparent; border-right: 5px solid transparent; border-top: 8px solid #fff;}
	.cart{ right: 0; background-position: -3.54rem -1.54rem;}
	.scan{ right: 0; background-position: 0.5rem -0.5rem;}
	.search{ right: 0; background-position: 1.54rem 1.54rem;}
	.iframeClose{ position: absolute; top: 0; right: 0.5rem; z-index: 21; font-size: 0.85rem; color: #fff;}
	.wheather{ display: flex; display: -webkit-flex; position: absolute; left: 0; top: 50%; z-index: 21; display: block; margin-top: -1.01rem; padding: 0 0.2rem; width: 3.6rem; height: 2rem; 
		img{ width: 2rem; height: 2rem;}
		.text{ font-size: 0.65rem; line-height: 1rem; color: #fff;}
	}
	
	&.noBg{ background-color: transparent;
		.tabs{ margin: auto 4rem; /* background-color: #38373c; */ display: flex; display: -webkit-flex; justify-content: space-around; -webkit-justify-content: space-around;
			a{ position: relative; flex:1; -webkit-flex:1; color: #000; text-align: center; line-height: 2.3rem;
				/* &+:before{ content: ''; position: absolute; top: 0.5rem; left: 0; width: 0; height: 1rem; border-left: 1px solid #909090;} */
				/* &:after{ content: ''; position: absolute; top: 30%; width: 0; height: 0; border-top: 6px solid #909090; border-left: 6px solid transparent; border-right: 6px solid transparent;} */
				&.on{ color: #ff4f4f; /* border-bottom: 2.5px solid @mainColor; */
					/* &:after{ border-top: 6px solid @mainColor; border-left: 6px solid transparent; border-right: 6px solid transparent;} */
				}
			}

		}
	}
}
.search-box{ margin: 0.5rem 2.8rem 0.5rem 0.5rem; height: 1.4rem; line-height: 1.4rem; font-size: 0.6rem; color: #fff; background-color: #fff; border-radius: 5px; width: 82%;border-radius: 25px;
	.search-btn{ display: block; margin: 0.24rem; width: 1rem; height: 1rem; background: url(../images/search_2.png) no-repeat; background-size: cover;}
	.search-txt{ float: left; height: 1.4rem; width: 75%; color: #606060; background-color: transparent; border: none; outline: none; line-height: normal; padding: 0;
		&::-webkit-input-placeholder{ color: #606060;}
	}
}

.index-search-box{ position: fixed; left: 0; top: 0; width: 100%; z-index: 2; opacity: 0.8;
	.index-search{ margin: 0.5rem auto; width: 80%; height: 1.2rem; line-height: 1.2rem; font-size: 0.6rem; color: #fff; background-color: #fff; border-radius: 5px; border-radius: 25px; box-sizing: border-box;
		.search-btn{ display: block; margin: 0.24rem; width: 0.76rem; height: 0.76rem; background: url(../images/search_2.png) no-repeat; background-size: cover;}
		.search-txt{ float: left; height: 1.2rem; width: 82%; color: #606060; background-color: transparent; border: none; outline: none; line-height: normal; padding: 0 0.5rem;
			&::-webkit-input-placeholder{ color: #606060;}
		}
	}
}
/* .search-box{ margin: 0.6rem auto; width: 70%; height: 1.2rem; line-height: 1.26rem; font-size: 0.6rem; color: #fff; background-color: rgba(255,255,255,0.35); border-radius: 1rem;
	.search-btn{ display: block; margin: 0.2rem 0.4rem; width: 0.8rem; height: 0.8rem; background: url(../images/search.png); background-size: cover; outline: none; border: none;}
	.search-txt{ float: left; margin: 0.25rem 0; padding:0.2rem; width: 70%; color: #fff; background-color: transparent; border: none; outline: none; 
		&::-webkit-input-placeholder{ color: #fff;}
	}
	&.searchWhite{  margin: 0.4rem 0 0.4rem 0.4rem; width: 80%; background-color: #fff;
		.search-btn{ background: url(../images/search2.png); background-size: cover;}
		.search-txt{ color: #b6b6b6; background-color: #fff; border-left: 1px solid #03a9f4; border-radius: 0;
			&::-webkit-input-placeholder{ color: #b6b6b6;}
		}
	}
} */
/*底部*/
.footer{ position: fixed; bottom: 0; left: 0; z-index: 19; width: 100%; text-align: center; background-color: #fff; border-top: 1px solid #ccc;
	.footerIcon{ float: left; display: block; font-size: 0.5rem; color: #606060; padding: 0.4rem 0 0.2rem;
		&.on{ color: @redColor;}
		&:before{ content: ''; display: block; margin: auto; margin-bottom: 5px; width: 1.2rem; height: 1.2rem; background: url(../images/index.png) no-repeat; background-size: 4.8rem auto;}
		&:first-child:nth-last-child(2),
		&:first-child:nth-last-child(2) ~ a{
			 width: 50%;
		}
		&:first-child:nth-last-child(3),
		&:first-child:nth-last-child(3) ~ a{
			 width: 33.3%;
		}
		&:first-child:nth-last-child(4),
		&:first-child:nth-last-child(4) ~ a{
			 width: 25%;
		}
		&:first-child:nth-last-child(5),
		&:first-child:nth-last-child(5) ~ a{
			 width: 20%;
		}
		.navNum{ position: absolute; top: 2px; left: 50%; content: ''; display: block; transform: translateX(0.5rem); -webkit-transform: translateX(0.5rem); border-radius: 50%; background-color: #ff0000; min-width: 16px; height: 16px; line-height: 17px; text-align: center; color: #fff; font-style: normal; font-size: 10px; padding: 0 3px; box-sizing: border-box;}
	}
	.unread{ position: relative;
		&:after{ position: absolute; left: 50%; top: 0.3rem; content: ''; width: 0.5rem; height: 0.5rem; background-color: #ff0000; border-radius: 50%; transform: translateX(0.5rem); -webkit-transform: translateX(0.5rem);}

	}
	.fhome{
		&:before{ background-position: 0 0;}
		&.on:before{ background-position: -1.2rem 0;}
	}
	.fservice{
		&:before{ background-position: -2.4rem 0;}
		&.on:before{ background-position: -2.4rem -1.2rem;;}
	}
	.fcompany{
		&:before{ background-position: 0 -1.2rem;}
		&.on:before{ background-position: -1.2rem -1.2rem;}
	}
	.fchild{
		&:before{ background-position: 0 -2.4rem;}
		&.on:before{ background-position: -1.2rem -2.4rem;}
	}
	.fclassify{
		&:before{ background-position: -3.6rem 0;}
		&.on:before{ background-position: -3.6rem -1.2rem;}
	}
	.fpublish{ position: relative;
		&:before{ background: none; }
		&:after{ position: absolute; top: -0.6rem; left: 50%; transform: translateX(-50%); -webkit-transform: translateX(-50%); content: ''; display: block; width: 2.25rem; height: 2.25rem; background: url(../images/fpublish.png) no-repeat; background-size: cover;}
	}
	.collection{ float: left; display: block; width: 50%; font-size: 0.8rem; color: #606060; padding: 0.2rem 0;
		&:before{ content: ''; display: block; margin: auto; margin-bottom: 5px; width: 1.2rem; height: 1.2rem; background: url(../images/collection.png) no-repeat; background-size: cover;}
		&.on:before{ background: url(../images/collection_gray.png) no-repeat;background-size: cover;}
	}
	.comment{ float: left; display: block; width: 50%; font-size: 0.8rem; color: #606060; padding: 0.2rem 0;
		&:before{ content: ''; display: block; margin: auto; margin-bottom: 5px; width: 1.2rem; height: 1.2rem; background: url(../images/comment.png) no-repeat; background-size: cover;}
	}
	.delete{ display: block; text-align: center; color: #fff; background-color: #0176dd; height: 2.5rem; line-height: 2.5rem; font-size: 0.8rem;
		&.disable{ background-color: #929292;}
	}
	.textBtn{ float: left; display: block; width: 49.8%; font-size: 0.8rem; color: #fff; background-color: rgb(187, 187, 187); height: 2.5rem; line-height: 2.5rem;
		&+.textBtn{ border-left: 1px solid #ccc; background-color: @redColor;}
		&.rejectBtn{ background-color: #cf2d34;}
	}

	.enrollBtn{ display: block; text-align: center; color: #fff; background-color: #ff9907; height: 2.5rem; line-height: 2.5rem; font-size: 0.8rem;
		&.disable{ background-color: #929292;}
	}

	.circleProgress_wrapper{ position: absolute; top: -0.85rem; left: 50%; transform: translateX(-50%); -webkit-transform: translateX(-50%); width: 2.7rem; height: 0.95rem; overflow: hidden;
		.wrapper{ position: absolute; width: 1.35rem; height: 2.7rem; top:0; overflow: hidden; }
	    .right{ right:0; }
	    .left{ left:0; }
	    .circleProgress{ position: absolute; top:0; width: 2.7rem; height: 2.7rem; border:1px solid transparent; border-radius: 50%;}
	    .rightcircle{ border-top:1px solid #ccc; border-right:1px solid #ccc; right:0; transform: rotate(-70deg); -webkit-transform: rotate(-70deg); background-color: #fff;
	    }
	    .leftcircle{ border-bottom:1px solid transparent; border-left:1px solid #ccc; left:0; transform: rotate(-70deg); -webkit-transform: rotate(70deg); background-color: #fff;
	    }
	}
}

/* 上传图片 */
.uploader{ padding: 0.5rem 2.4%; background-color: #fff;
	.uploader__bd {  margin-top: 4px; margin-bottom: -4px;margin-left: 2vw;
	.uploader__files{ list-style: none;}
	.uploader__file { position: relative; float: left; margin-right: 3vw; margin-bottom: 9px; width: 28vw;/*  width: 4rem; height: 4rem; background: no-repeat 50%; background-size: cover; */ }
	.photo{ display: block; width: 100%; height: 4rem; overflow: hidden; text-align: center;}
	.delIcon{ position: absolute; top: -0.5rem; right: -0.5rem; display: block; width: 1rem; height: 1rem; background: url(../images/closeImg.png) no-repeat; background-size: cover; 
	}
	.uploader__input-box { float: left; position: relative; margin-right: 3vw; margin-bottom: 9px; width: 28vw; /* width: 4rem; height: 4rem; border: 1px solid #808080; */ background-color: #eee;}
	/* .uploader__input-box:after,.uploader__input-box:before { content: " "; position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%,-50%); transform: translate(-50%,-50%); background-color: #d9d9d9 }
	.uploader__input-box:before { width: 2px; height: 1rem; }
	.uploader__input-box:after { width: 1rem; height: 2px; }
	.uploader__input-box:active { border-color: #999 }
	.uploader__input-box:active:after,.uploader__input-box:active:before { background-color: #999 } */

	.uploader__input { position: absolute; z-index: 1; top: 0; left: 0; width: 100%; height: 100%; opacity: 0; -webkit-tap-highlight-color: rgba(0,0,0,0) }
	}
	.uploader__tip{ position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%,-50%); transform: translate(-50%,-50%); font-size: 0.5rem; color: #929292; white-space: nowrap;
		&:before { display: block; margin: 0 auto 0.5rem; content: " "; width: 1.5rem; height: 1.5rem; background: url(../images/addIcon.png) no-repeat; background-size: cover;}
	}
	.uploader__info { margin-top: 0.5rem; padding-bottom: 0.25rem; font-size: 0.6rem; color: #999; line-height: 1.2; list-style: none; overflow: hidden; }
}

/*背景层*/
.pop_bg,.popbg{ display: none; position: fixed; top: 0; left: 0; z-index: 20; width: 100%; height: 100%; background-color: #000; opacity: 0.7; -webkit-opacity: 0.7; -moz-opacity: 0.7; filter:alpha(opacity=70);}
/*alert*/
.popBox{ display: none; position: absolute; top: 50%;  left: 50%; transform: translate(-50%,-50%); -webkit-transform: translate(-50%,-50%); z-index: 23; width: 100%; font-size: 0.65rem; text-align: center; color: #606060; background-color: transparent;
}
.popScroll{ display: none; position: absolute; top: 0;  left: 0; z-index: 23; width: 100%; font-size: 0.65rem; text-align: center; color: #606060; background-color: transparent;
	img{ width: 100%;}
}
/*alert*/
.pop_box{ position: fixed; top: 50%;  left: 50%; transform: translate(-50%,-50%); -webkit-transform: translate(-50%,-50%); z-index: 23; display: none; width: 50%; font-size: 0.5rem; text-align: center; color: #606060; background-color: #fff;
	.pop_text{ margin: 5% 0; text-align: left;
		.title{ display: block; margin: 0 0.5rem; padding: 0 0.5rem; border-left: 2px solid #0176dd;}
	}
	.pop_desc{ display: block; margin-bottom: 5%; font-size: 0.5rem; margin: 0 0.5rem; text-align: left;}
	.pop_button{ display: flex; display: -webkit-flex; font-size: 0.5rem; border-top: 1px solid #ccc;
		.pop_btn{ flex: 1; -webkit-flex: 1; padding: 2.5% 0; color: #fff; background-color: @mainColor; cursor: pointer; 
			&:first-child{ border-right: 1px solid #ccc; color: #333; background-color: #ccc;}
		}
	}
	img{ margin: auto; width: 50%;}
	.close{ position: absolute; right: 0; top: 0; width: 0.5rem; height: 0.5rem; background: url(../images/closeImg.png); background-size: cover; cursor: pointer;}
	.pop_button.oneBtn{
		.pop_btn{ color: #fff; background-color: #0176dd;}
	}
	.fillInput{ padding: 2%; margin-bottom: 3.75%; width: 90%; height: 1rem; line-height: 1rem; border: 1px solid #ccc; border-radius: 5px; outline: none;}
	.textArea{ padding: 2%; margin-bottom: 3.75%; /*width: 100%;*/ height: 5rem; border: 1px solid #ccc; outline: none; resize: none;}
}
/* 输入提示 */
.fill_tip { position: fixed; top: 25%; left: 50%; transform: translateX(-50%); -webkit-transform: translateX(-50%); z-index: 25; padding: 2.5% 0; width: 80%; font-size: 0.65rem; text-align: center; color: #fff; background-color: rgba(0, 0, 0, 0.5); border-radius: 5px;}

/*没有数据时*/
.noneCont{ display: block; padding-top: 2rem; text-align: center; font-size: 0.6rem; color: #999;
	.noneImg{ display: block; margin: 5% auto; width: 25%;}
	.lookGoods{ display: inline-block; margin-top: 1rem; padding: 0.5rem; color: #fff; background-color: @mainColor; border-radius: 5px; font-size: 0.7rem;}
}

.require{ position: relative; padding-left: 0.5rem;
	&:before{ position: absolute; top: 10%; left: 0; content: '*'; color: #ce2d33;}
}

.tabFixed{ position: fixed; left: 0; top: 2.3rem; width: 100%; z-index: 1;
}
.tabContent{ padding-top: 1.7rem; }

.weui-photo-browser-modal .photo-container img,video{
    width: 100%;
}

/* 320px */
@media screen and (min-width: 320px) {
	html{ font-size: 20px;}
}

/* 480px */
@media screen and (min-width: 480px) {
	html{ font-size: 30px;}
}

/* 750px */
@media screen and (min-width: 750px) {
	html{ font-size: 48px;}
}